<template>

    <div class="page">
        <div class="resBox">

            <div class="resHead">

                <!--class winner 胜利-->
                <div :class="[{winner:result.myscore >result.otherscore},'wo']" id="wowin">
                    <div class="avatar">
                        <img :src='result.myimg' alt="">
                    </div>
                    <span class="name">{{ result.myname }}</span>
                </div>

                <div class="vs"></div>


                <div :class="[{winner:result.myscore <result.otherscore},'ta']" id="tawin">
                    <div class="avatar">
                        <img :src='result.otherimg' alt="">
                    </div>
                    <span class="name">{{ result.othername }}</span>
                </div>
            </div>

            <div class="resScore">
                <div class="wo">
                    <span>答题得分:</span>
                    <span class="num">{{ result.myscore }}</span>
                </div>

                <div class="ta">
                    <span>答题得分:</span>
                    <span class="num">{{ result.otherscore }}</span>
                </div>
            </div>

            <div class="resBody">
                <div class="btns">
                    <div class="again" @click="pkAgain">再来一局</div>
                    <div class="share" @click="shareTip">我要分享</div>
                    <div class="back" @click="goHome">返回首页</div>
                </div>
            </div>

        </div>

        <!--pk成绩分享浮层-->
        <div id="ak" class="modal fade in" role="dialog" aria-hidden="true">
            <div class="resultShareBox" data-dismiss="modal">
                <img :src="appConfig.staticUrl+'answerpk/img/pk_result_share.png'" alt="">
            </div>
        </div>
    </div>
</template>

<script>
import appConfig from "../config/appConfig";

export default {
    name: 'result',
    data() {
        return {
            uid: this.userHelper.getInfo('user_cert'),
            result: [],
            pkuserinfo: {},
        }
    },

    created: function () {
        this.wxShare();
    },
    mounted: function () {

    },
    activated: function () {
        this.result = JSON.parse(localStorage.getItem('reultlog'));
        this.pkuserinfo = JSON.parse(localStorage.getItem('pkuserinfo'));

        if (this.result.myscore > this.result.otherscore) {
            $('wowin').addClass('winner');
        } else if (this.result.myscore < this.result.otherscore) {
            $('tawin').addClass('winner');
        } else {
            $("<div class='deuce'><span>平局</span></div>").insertAfter(".resScore .wo");
        }
    },
    methods: {
        onmessage(e) {
            console.log(e);
        },

        // 再来一局
        pkAgain: function () {
            localStorage.setItem('reultlog', '');
            localStorage.setItem('pkuserinfo', '');
            if (this.pkuserinfo && this.pkuserinfo.gameType === 'invite_std') {
                this.$router.push({
                    path: 'index',
                    query: {
                        room: this.commonHelper.generateRoomID(),
                        roomOwner: this.uid,
                        time: (new Date).getTime(),
                    }
                }).then(() => {
                    this.$emit('handle', {name: 'pkInvite', type: 'pkAgain'});
                });
            } else {
                this.$emit('handle', {name: 'pkRandom'});
            }
        },

        // 分享提示
        shareTip: function () {
            $("#ak").modal();
        },

        // 回到首页
        goHome: function () {
            location.href = appConfig.onLineApiDomain + '/index';
        },

        // 微信分享
        wxShare: function () {
            this.wxHelper.init({
                types: ['share'],
                callback: (status) => {
                    if (status) {
                        this.wxHelper.shareMessage({
                            title: '我参加了“党史天天学”知识竞答双人对战，快来挑战我吧！', // 分享标题
                            desc: '', // '我参加了“党史天天学”知识竞答双人对战，快来挑战我吧！', // 分享描述
                            link: appConfig.onLineApiDomain + '/index', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                            imgUrl: appConfig.onLineDomain + '/h5/img/wxShare.jpg', // 分享图标
                        });
                    }
                }
            });
        },
    },
}
</script>
